Web Design Unit 4

Intro to HTML


Written Instructions/tutorial:

Basic Tags:
Bold <b>
Underline <u>
Italics <i>
Font Color: <font color=BLUE>XXXXX</font>
Paragraph <p>
Break <br>
Horizontal rule <hr>

Tables:
Table Start/End <table>
Table Row <tr>
Table Data <td>

Hyperlinks:
Anchor Link <a href="URL">XXXXXXX</a>

Embedded Images:
<img src="URL">

Formatting Tags:
Formatting
Other HTML tags


Video Instructions:

Basic Tags





Tables


URLs


Embedding Images



HTML Project #1 Notepad Sandbox


Play in Notepad to test your HTML skills. Try to create the following HTML document. When finished, save this document as "index.html" and email it to me.

external image 20091020-gettysburg.jpg
The Gettysburg Address
Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in liberty, and dedicated to the proposition that all men are created equal.
Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure.

Significant Events of the Civil War


Fort Sumpter
4/12/1861
Gettysburg Address
11/19/1863
Confederate Surrender
4/7/1865
Library of Congress Site



HTML Project #2 Real-Time HTML Editor

Welcome back from February Break! Lets jump back into class and see how much of your HTML skills survived the week off. The next few days you will start building your class Portfolio. The sites and activities from in class work, will be added to your Portfolio and evaluated/graded at the end of the semester. This will be a showcase of both your work, and your growth as a designer. I am still searching for a good Portfolio host, so we will return to that soon.

For this project, you will create a webpage using a Real-Time HTML Editor, like this one. Using this editor make a page for your favorite restaurant. It can be a local place, or a national chain- McDonald's, or Dunkin Dounuts are all fine. This site must have the following info.

  • Banner- more in class....
  • Header/Title
  • Short paragraph "selling" why its your favorite.
  • Services/Options from the restaurant
  • External link to their official website, Menu,
  • Contact Info

Example- Pasta Divine